<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ice="http://www.icesoft.com/icefaces/component">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link rel="shortcut icon" href="./resources/images/favicon.ico"/>
        <!--<link rel="stylesheet" type="text/css" href="./resources/css/style.css"/>-->
        <title>HEARTS GAME by SDI Team</title>
    </h:head>
    <h:body>
    <ice:outputStyle href="./resources/css/style.css"/>
        <div id="top">
            <ui:insert name="top">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td align="center" valign="top"><table width="950" border="0" align="center" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td align="left" valign="top">
                                        <div id="header">
                                            <ice:form id="head">
                                            <ice:commandLink action="home" ><h:graphicImage value="./resources/images/logo.png"/></ice:commandLink>
                                            </ice:form>
                                        </div></td>
                                </tr>
                                <tr>
                                    <td align="right" valign="top"><table width="680" border="0" cellspacing="0" cellpadding="0">
                                            <tr>
                                                <td height="62" align="center" valign="middle" id="topMenu">
                                                    <table border="0" cellspacing="0" cellpadding="5" >
                                                        <tr>
                                                            
                                                                <td align="center" valign="middle"><ice:graphicImage value="./resources/images/icon.gif"></ice:graphicImage></td>
                                                                <td align="center" valign="middle">
                                                                    <ice:form id="menu">
                                                                        <ice:panelGroup rendered="#{userManager.loggedIn}">
                                                                            <span style="color: #510501">Welcome, <b>#{userManager.user.user}</b> </span>
                                                                        </ice:panelGroup>
                                                                        <ice:panelGroup rendered="#{!userManager.loggedIn}">
                                                                            <ice:commandLink value="Login" action="login" /> -  <ice:commandLink value="Register" action="register" />
                                                                        </ice:panelGroup>
                                                                    </ice:form>

                                                                </td>
                                                            <td align="center" valign="middle"><ice:graphicImage value="./resources/images/icon.gif"></ice:graphicImage></td>
                                                            
                                                        </tr>
                                                    </table></td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                                <tr>
                                    <td align="center" valign="top"><table width="950" border="0" cellspacing="0" cellpadding="0">
                                            <tr>
                                                <td align="left" valign="top" id="centerCol"><table width="100%" border="0" cellspacing="0" cellpadding="0">

                                                        <tr>
                                                            <td align="left" valign="top">&nbsp;</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top">
                                                                <ice:panelGroup rendered="#{!userManager.loggedIn}">
                                                                    <div id="welcome">
                                                                        <h2>Welcome to Hearts SDI website!</h2>
                                                                        <p style="text-align: justify"><strong>Please Login or Register to start playing!</strong><br />
                                                                            The object of the game is to receive as few hearts
                                                                            as possible and avoid the queen of Spades. The winner is the person with the lowest score when one player reaches a pre-determined score, usually 100. Every heart taken
                                                                            in a trick is one point. In addition, the queen of spades (also called the "Black Lady")
                                                                            carries 13 points. However, if one player can succeed in getting
                                                                            all the cards that carry points - all the hearts plus the queen of spades -- that
                                                                            player gets no points, and every other player gets 26 points. This is known as
                                                                            "running" or "shooting the moon"</p>
                                                                    </div>
                                                                </ice:panelGroup>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top">&nbsp;</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                                    <tr>
                                                                        <td align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0" class="box_heading">
                                                                                <tr>
                                                                                    <td width="56" align="left" valign="top">
                                                                                        <ice:graphicImage value="./resources/images/arrow.gif"></ice:graphicImage>
                                                                                    </td>
                                                                                    <td align="left" valign="middle" class="fontSize18">Hearts Game</td>
                                                                                    <td align="right" valign="middle" style="padding-left: 5px; padding-right: 10px;"  >
                                                                                        <ice:form>
                                                                                        <ice:panelGroup rendered="#{userManager.loggedIn}">
                                                                                            Welcome, #{userManager.user.user} - <ice:commandLink value="Logout"
                                                                                                                                                 action="#{userManager.logout}" />
                                                                                        </ice:panelGroup>
                                                                                            <ice:panelGroup rendered="#{!userManager.loggedIn}">
                                                                                            <ice:commandLink value="Login" action="login" /> -  <ice:commandLink value="Register" action="register" />
                                                                                        </ice:panelGroup>
                                                                                        </ice:form>
                                                                                    </td>
                                                                                </tr>
                                                                            </table>
                                                                        </td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td bgcolor="#271C1B"><table width="100%" border="0" cellspacing="0" cellpadding="24">
                                                                                <tr>
                                                                                    <td>

                                                                                        <div id="content" class="center_content">
                                                                                            <ui:insert name="content">
                                                                                            </ui:insert>
                                                                                        </div>
                                                                                    </td>
                                                                                </tr>
                                                                            </table>
                                                                        </td>
                                                                    </tr>
                                                                </table>
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>

            </ui:insert>
        </div>



        <div id="bottom">
            <ui:insert name="bottom">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td align="center" valign="top"><div id="footer">                                
                                <p> Copyright &copy; 2011. SDI TEAM - Alessandro De Troia, Daniele Incicco, Matteo Fanciulli</p>
                            </div>
                        </td>
                    </tr>
                </table>
                <br></br>
                <table width="950" height ="100" border="0" align="center" cellpadding="0" cellspacing="0">

                    <tr><td align="left" valign="middle">

                            <div align="center">
                                <div id="fb-root"></div>
                                <script type="text/javascript">(function(d, s, id) {
                                    var js, fjs = d.getElementsByTagName(s)[0];
                                    if (d.getElementById(id)) {return;}
                                    js = d.createElement(s); js.id = id;
                                    js.src = "http://connect.facebook.net/en_US/all.js#xfbml=1";
                                    fjs.parentNode.insertBefore(js, fjs);
                                }(document, 'script', 'facebook-jssdk'));</script>

                                <div id ="fb-like-box" class="fb-like-box" data-href="http://www.facebook.com/pages/SDI-Team/130944710322690" data-width="292" 
                                     data-colorscheme="light" data-show-faces="false"
                                     data-stream="false" data-header="true" border="0" frameborder="0" scrolling="no" style="border:none; overflow:hidden;"></div><br></br>
                                Template created by <a href="http://www.casinotemplates.org" target="_blank"><font color="#FF6600">Poker Templates</font></a> - Edited by SDI Team
                            </div></td></tr></table>



            </ui:insert>
        </div>

    </h:body>

</html>
